<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
	th:with="title='保存文章',active='publish'">
<header th:replace="admin/header::headerFragment(${title},${active})"></header>
<link th:href="@{/admin/plugins/tagsinput/jquery.tagsinput.css}"
	rel="stylesheet" />
<link th:href="@{/admin/plugins/select2.dist.css/select2-bootstrap.css}"
	rel="stylesheet" />
<link th:href="@{/admin/plugins/toggles/toggles.css}" rel="stylesheet" />

<link href="//cdn.bootcss.com/multi-select/0.9.12/css/multi-select.css"
	rel="stylesheet" />
<link href="//cdn.bootcss.com/select2/3.4.8/select2.min.css"
	rel="stylesheet" />
<link th:href="@{/admin/plugins/mditor/css/mditor.min.css}"
	rel="stylesheet" />
<link th:href="@{/admin/plugins/dropzone/4.3.0/min/dropzone.min.css}"
	rel="stylesheet">
<style>
#tags_tagsinput {
	background-color: #fafafa;
	border: 1px solid #eeeeee;
}

#tags_addTag input {
	width: 100%;
}

#tags_addTag {
	margin-top: -5px;
}

.mditor .editor {
	font-size: 14px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.mditor .backdrop, .mditor .textarea, .mditor .viewer {
	font-size: 14px;
}

.markdown-body {
	font-size: 14px;
}

.note-toolbar {
	text-align: center;
}

.note-editor.note-frame {
	border: none;
}

.note-editor .note-toolbar {
	background-color: #f5f5f5;
	padding-bottom: 10px;
}

.note-toolbar .note-btn-group {
	margin: 0;
}

.note-toolbar .note-btn {
	border: none;
}

#articleForm #dropzone {
	min-height: 200px;
	background-color: #dbdde0;
	line-height: 200px;
	margin-bottom: 10px;
}

#articleForm .dropzone {
	border: 1px dashed #8662c6;
	border-radius: 5px;
	background: white;
}

#articleForm .dropzone .dz-message {
	font-weight: 400;
}

#articleForm .dropzone .dz-message .note {
	font-size: 0.8em;
	font-weight: 200;
	display: block;
	margin-top: 1.4rem;
}
</style>
<body class="fixed-left">
	<div id="wrapper">
		<div th:replace="admin/header::header-body"></div>
		<div class="content-page">
			<div class="content">
				<div class="container">
					<div class="row">
						<div class="col-sm-12">
							<h4 class="page-title">
								<th:block th:if="${null != article}">
                                编辑文章
                            </th:block>
								<th:block th:unless="${null != article}">
                                发布文章
                            </th:block>
							</h4>
						</div>
						<div class="col-md-12">

							<input type="hidden" id="attach_url" th:value="${attach_url}" />

							<form id="articleForm">
								<input type="hidden" name="category" id="category" /> <input
									type="hidden" name="id"
									th:value="${article!=null and article.id!=null}?${article.id}: ''"
									id="id" /> <input type="hidden" name="status" id="status" />
								<input type="hidden" name="content" id="content-editor" /> <input
									type="hidden" name="fmtType" id="fmtType" /> <input
									type="hidden" name="top"
									th:value="${article.top==1}?${article.top}: 1" id="istop" />
								<div class="form-group col-md-6" style="padding: 0 10px 0 0;">
									<input type="text" class="form-control"
										placeholder="请输入文章标题（必须）" name="title" required="required"
										aria-required="true"
										th:value="${article!=null and article.title!=null }?${article.title}: ''" />
								</div>
								<div class="form-group col-md-6">
									<select id="multiple-sel" class="select2 form-control"
										multiple="multiple" data-placeholder="请选择分类...">
										<option th:value="${article.category}"
										th:text="${article.category}" selected="selected"></option>
										<option value="Java">Java</option>
										<option value="js">js</option>
										<option value="ajax">ajax</option>
										<option value="数据库">数据库</option>
										<option value="程序那点事">程序那点事</option>
									</select>
								</div>
								<div class="clearfix"></div>
								<div id="md-container" class="form-group">
									<textarea id="md-editor"
										th:utext="${article!=null and article.content !=null}?${article.content}: ''"></textarea>
								</div>
								<div class="clearfix"></div>
								<div class="form-group col-md-3 col-sm-4">
									<label class="col-sm-4">是否置顶</label>
									<div class="col-sm-8">
										<div
											th:class="${article.top==0}?'toggle toggle-success allow-false': 'toggle toggle-success allow-true'"
											onclick="istop(this);"></div>
									</div>
								</div>
								<div class="text-right">
									<a class="btn btn-default waves-effect waves-light"
										th:href="@{/admin/article}">返回列表</a>
									<button type="button"
										class="btn btn-primary waves-effect waves-light"
										onclick="subArticle('publish');">保存文章</button>
								</div>
							</form>
						</div>
					</div>
					<div th:replace="admin/footer :: footer-content"></div>
				</div>
			</div>
		</div>
	</div>
	<div th:replace="admin/footer :: footer"></div>

	<script th:src="@{/admin/plugins/tagsinput/jquery.tagsinput.min.js}"></script>
	<script
		th:src="@{/admin/plugins/jquery-multi-select/jquery.quicksearch.js}"></script>

	<script th:src="@{/admin/plugins/mditor/js/mditor.min.js}"></script>
	<script
		th:src="@{/admin/plugins/multi-select/0.9.12/js/jquery.multi-select.min.js}"></script>
	<script th:src="@{/admin/plugins/select2/3.4.8/select2.min.js}"></script>
	<script
		th:src="@{//cdn.bootcss.com/jquery-toggles/2.0.4/toggles.min.js}"></script>
	<script th:src="@{/admin/plugins/dropzone/4.3.0/min/dropzone.min.js}"></script>
	<script th:src="@{/admin/plugins/to-markdown/3.1.0/to-markdown.min.js}"></script>

	<script th:src="@{/admin/js/article.js}"></script>
</body>
</html>